// // JavaScript Document

function getclass(oparent, sclass){
    var divx = oparent.getElementsByTagName('*')
    var arr = [];
    for(var i = 0; i < divx.length;i++){
        if(divx[i].className == sclass){
            arr.push(divx[i])
        }
    }	
return arr
}

function getstyle(divx, sx){
    if(divx.currentStyle){
        return divx.currentStyle[sx]
    }else{
        return getComputedStyle(divx, false)[sx]	
    }	
}
function start(a, yd, d){
    clearInterval(a.dsq);
    a.dsq = setInterval(function (){
        
        var bstop = true;
        
        for(var b in yd){	
            if(b == 'opacity'){
                var zhi = Math.round(parseFloat(getstyle(a, b))*100)	
            }else{
                var zhi = parseInt(getstyle(a, b))	
            }
            var sd = (yd[b] - zhi)/6;
            if(sd < 0){
                sd = Math.floor(sd)
            }else{
                sd = Math.ceil(sd)	
            }
            
            if(zhi != yd[b]){
                bstop = false;	
            }
            
            if(b == 'opacity'){
                a.style.opacity = (sd + zhi)/100;
                a.style.filter = 'alpha(opacity:'+(sd+zhi)+')'
            }else{
                a.style[b] = zhi+sd + 'px'	
            }
        }
        
        if(bstop == true){
            clearInterval(a.dsq);
            
            if(d){
                d();
            }
        }
        
    },30)	
}

function alp(a, yd, d){
    clearInterval(a.dsq);
    a.dsq = setInterval(function (){
        
        var bstop = true;
        
        for(var b in yd){	
            if(b == 'opacity'){
                var zhi = Math.round(parseFloat(getstyle(a, b))*100)	
            }else{
                var zhi = parseInt(getstyle(a, b))	
            }
            var sd = (yd[b] - zhi)/25;
            if(sd < 0){
                sd = Math.floor(sd)
            }else{
                sd = Math.ceil(sd)	
            }
            
            if(zhi != yd[b]){
                bstop = false;	
            }
            
            if(b == 'opacity'){
                a.style.opacity = (sd + zhi)/100;
                a.style.filter = 'alpha(opacity:'+(sd+zhi)+')'
            }else{
                a.style[b] = zhi+sd + 'px'	
            }
        }
        
        if(bstop == true){
            clearInterval(a.dsq);
            
            if(d){
                d();
            }
        }
        
    },30)	
}

function sjbd(obj, ff, hs){
    if(obj.attachEvent){
        obj.attachEvent('on'+ff, hs)	
    }else{
        obj.addEventListener(ff, hs, false)	
    }	
}
window.onload = function (){
    var mian = document.getElementById('main')
    var left = getclass(mian, 'left')[0]
    var right = getclass(mian, 'right')[0]
    
    sjbd(mian, 'mouseover', function (){
        start(left, {opacity:100, left:80})
        start(right, {opacity:100, right:80})	
    })
    sjbd(mian, 'mouseout', function (){
        start(left, {opacity:0, left:20})
        start(right, {opacity:0, right:20})	
    })
    var smaul = getclass(mian, 'smaul')[0]
    var smali = smaul.getElementsByTagName('li')
    var bigul = getclass(mian, 'bigul')[0]
    var bigli = bigul.getElementsByTagName('li')
    
    var now = 0;
    var nowzindex = 1;
    
    for(var i = 0; i < smali.length; i++){
        smali[i].ix = i
        smali[i].onclick = function (){
            now = this.ix
            lbo();	
        }
    }
    function lbo(){
        for(var i = 0; i < smali.length; i++){
            smali[i].id = ''
        }
        smali[now].id = 'thisli'
        bigli[now].style.zIndex = nowzindex++;
        bigli[now].style.opacity = 0;
        bigli[now].style.filter = 'alpha(opacity:0)'
        alp(bigli[now], {opacity:100})	
    }
    left.onclick = function (){
        now--;
        if(now == -1){
            now = smali.length -1 
        }
        lbo();	
    }
    right.onclick = function (){
        now++
        if(now == smali.length){
            now = 0
        }
        lbo();	
    }
    
    dsq = setInterval(right.onclick, 3000)
   
    sjbd(mian, 'mouseover', function (){
        clearInterval(dsq)	
    })
    sjbd(mian, 'mouseout', function (){
        dsq = setInterval(right.onclick, 3000)	
    })
}





